<template>
  <div>
    <el-card class="box-card">
      <div slot="header" class="card-header">
        <span class="title">验收标准管理</span>
        <div class="btn-wrap">
          <span v-show="$route.query.type === 'audit'">
            <el-button
              size="middle"
              type="text"
              @click="handleOpenAuditDialog"
              >审核</el-button
            >
            <!-- <el-divider direction="vertical"></el-divider> -->
          </span>
          <!-- <el-button size="middle" type="text" @click="handleBack"
            >返回</el-button
          > -->
        </div>
      </div>
      <div>
        <Umy-table
          :loading="tableLoading"
          :data-source="baseTableData"
          :columns="tableColumns"
          :isShowSortNum="true"
          :tableHeight="600"
        />
      </div>
      <FooterFields :footerFields="datalist" />
    </el-card>
    <!-- 审核弹框组件 -->
    <audit-dialog :visible.sync="auditDialogVisible" />
  </div>
</template>
<script>
import { ApiRequest } from '@api/basePage';
import UmyTable from '@/components/UmyTable';
import AuditDialog from '@/components/common/dialog/auditDialog';
import FooterFields from '@/pages/commodity/components/FooterFields';
export default {
  components: {
    AuditDialog,
    UmyTable,
    FooterFields
  },
  data () {
    return {
      tableLoading: false,
      auditDialogVisible: false, // 审核弹框visible
      datalist: {},
      totalNum: 0,
      pageShow: 10,
      nowPage: 1,
      baseTableData: [],
      skuNoList: [],
      uuids: '',
      productName: '',
      spuNo: '', // spuNo_q=EQ
      ready: true,
      colums2: [],
      tableColumns: [
        {
          title: '分类',
          key: 'categoryPath',
          minWidth: 180
        },
        {
          title: 'SPU编码',
          key: 'spuNo',
          align: 'center',
          minWidth: 140
        },
        {
          title: 'SKU编码',
          key: 'skuNo',
          align: 'center',
          minWidth: 140
        },
        {
          title: '商品名称',
          key: 'productName',
          align: 'center',
          minWidth: 140
        },
        {
          title: '品牌',
          key: 'brandName',
          align: 'center',
          minWidth: 140
        },
        {
          title: '规格',
          key: 'specDetailStr',
          align: 'center',
          minWidth: 140
        },
        {
          title: '验收频率',
          key: 'checkFrequencyUpdate',
          align: 'center',
          minWidth: 140
        },
        {
          title: '验收时间',
          key: 'checkTimeUpdate',
          align: 'center',
          minWidth: 140
        }
      ],
      apiObj: {
        // 点击批量维护/查看/编辑，进入维护页面（品类、商品状态必须相同）
        getListByUuids: {
          url: '/sysback/checkstandarddetail/getListByUuids', // 接口地址
          type: 'post' // 接口请求类型
        },
        // 保存
        saveBasicInfo: {
          url: '/sysback/checksd/finish/commitFinish', // 接口地址
          type: 'post' // 接口请求类型
        },
        getListByrecordNo: {
          url: '/sysback/checksd/finish/getRecord', // 接口地址
          type: 'post' // 接口请求类型
        }
      }
    };
  },
  created () {
    const { recordNo, uuids } = this.$route.query;
    if (recordNo) {
      this.recordNo = recordNo;
      this.initData2();
    } else if (uuids) {
      this.uuids = uuids;
      this.initData();
    }
  },
  methods: {
    /* 打开审核弹框 */
    handleOpenAuditDialog () {
      this.auditDialogVisible = true;
    },
    initData () {
      this.tableLoading = true;
      let data = {};
      // 开始请求列表
      ApiRequest(
        this.apiObj.getListByUuids.url + '?uuids=' + this.uuids,
        this.apiObj.getListByUuids.type,
        data,
        false
      ).then((res) => {
        this.tableLoading = false;
        if (res.retStatus === '1') {
          let reData = res.retData;
          this.initView(reData);
        }
      }).catch(() => {
        this.tableLoading = false;
      });
    },
    initData2 () {
      let data = {};
      this.tableLoading = true;
      // 开始请求列表
      ApiRequest(
        this.apiObj.getListByrecordNo.url + '?recordNo=' + this.recordNo,
        this.apiObj.getListByrecordNo.type,
        data,
        false
      ).then((res) => {
        this.tableLoading = false;
        if (res.retStatus === '1') {
          const { record, checkStandardDTOList } = res.retData;
          this.datalist = record
          let reData = checkStandardDTOList;
          this.initView(reData);
        }
      }).catch(() => {
        this.tableLoading = false;
      });
    },
    initView (reData) {
      this.baseTableData = [];
      this.colums2 = [];
      reData.forEach((element, oneIndex) => {
        this.baseTableData.push({
          uuid: element.uuid,
          operationNumber: element.operationNumber,
          createOpeTime: element.createOpeTime,
          skuNo: element.skuNo,
          specDetailStr: element.specDetailStr,
          spuNo: element.spuNo,
          productUuid: element.productUuid,
          productName: element.productName,
          categoryPath: element.categoryPath,
          brandName: element.brandName,
          checkTime: element.checkTime,
          checkTimeUpdate: element.checkTimeUpdate,
          checkFrequency: element.checkFrequency,
          checkFrequencyUpdate: element.checkFrequencyUpdate,
          productAddState: element.productAddState,
          categoryName: element.categoryName,
          detailList: element.detailList
        });
        element.detailList.forEach((item, index) => {
          if (oneIndex === 0) {
            this.pushItem(item, oneIndex, index, reData.detailList);
          }
        });
      });
      this.colums2.forEach((element, index) => {
        this.tableColumns.push(element);
      });
    },
    // 导出表格
    exportTable () {
      if (
        this.skuNoList === null ||
        this.skuNoList.length === 0 ||
        this.skuNoList === undefined
      ) {
        this.$Message.error('请先勾选要导出的数据');
        return false;
      } else {
        window.location.href =
          this.exportBaseURL +
          '/sysback/checksd/finish/exportPageToExcelGet?skuNoList=' +
          this.skuNoList.join(',') +
          '&menuId=166&buttonId=2';
      }
    },
    handleSelect (row) {
      this.skuNoList = [];
      row.forEach((element) => {
        this.skuNoList.push(element.skuNo);
      });
    },
    // 表格里面的删除操作
    toDel (row, index) {
      this.baseTableData.splice(index, 1);
    },
    // 数据赋值处理
    onChageRow (row, index) {
      this.baseTableData[index] = row;
    },
    // 生成代码
    pushItem (item, waiIndex, neiIndex, row) {
      if (item.checkItemType === '1') {
        this.colums2.push({
          title: item.checkItemName,
          key: item.checkItemName,
          width: 150,
          align: 'center',
          children: [
            {
              title: '验收次数值',
              // key: item.checkCount,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('span', item.checkCountUpdate);
              }
            },
            {
              title: '标准值',
              // key: item.standardValue,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('span', item.standardValueUpdate);
              }
            },
            {
              title: '上差值',
              // key: item.upDiffValue,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('span', item.upDiffValueUpdate);
              }
            },
            {
              title: '下差值',
              // key: item.downDiffValue,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('span', item.downDiffValueUpdate);
              }
            },
            {
              title: '验收方法值',
              // key: item.checkMethod,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('span', item.checkMethodUpdate);
              }
            }
          ]
        });
      } else {
        this.colums2.push({
          title: item.checkItemName,
          key: item.checkItemName,
          width: 150,
          align: 'center',
          children: [
            {
              title: '验收次数值',
              // key: item.checkCount,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('span', item.checkCountUpdate);
              }
            },
            {
              title: '标准值',
              // key: item.standardValue,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('span', item.standardValueUpdate);
              }
            },
            {
              title: '验收方法值',
              // key: item.checkMethod,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('span', item.checkMethodUpdate);
              }
            }
          ]
        });
      }
    },
    handleBack () {
      this.$router.go(-1);
    },
  }
};
</script>
<style lang="less" scoped>
.btn-wrap {
  float: right;
  .import-file {
    display: inline;
  }
}
.card-header {
  .title {
    font-size: 16px;
  }
}
.info-card {
  margin-top: 10px;
  font-size: 14px;
  color: #666;
  font-weight: 400;
  .item {
    margin-right: 30px;
  }
}
</style>
